{% extends "store/base.html" %}
{% block title %}个人中心{% endblock %}
{% block content %}
    <form class="form" action="" method="post" enctype="multipart/form-data">
        {% csrf_token %}
        <div class="container">
            <div class="col-md-4 offset-4">
                <img style="width: 200px" src="/static/{{ userinfo.picture }}" alt="">
            </div>
        </div>

        <div class="form-group">
            <label>账号</label>
            <p class="form-control">{{ userinfo.username }}</p>
        </div>
        <div class="form-group">
            <label>姓名</label>
            <input class="form-control" type="text" name="nick_name" value="{{ userinfo.nickname }}">
            <span style="color: red">{{ userinfoform.nick_name.errors }}</span>
        </div>
        <div class="form-group">
            <label>性别</label>
            <select name="gender" id="">
                <option value="1">男</option>
                <option value="0">女</option>
                <option value="" selected hidden>{{ userinfo.get_gender_display }}</option>
            </select>
            <span style="color: red">{{ userinfoform.gender.errors }}</span>
        </div>
        <div class="form-group">
            <label>手机号</label>
            <input class="form-control" type="text" name="phone" value="{{ userinfo.phone }}">
            <span style="color: red">{{ userinfoform.phone.errors }}</span>
        </div>
        <div class="form-group">
            <label>邮箱</label>
            <input class="form-control" type="text" name="email" value="{{ userinfo.email }}">
            <span style="color: red">{{ userinfoform.email.errors }}</span>
        </div>
        <div class="form-group">
            <label>地址</label>
            <input class="form-control" type="text" name="address" value="{{ userinfo.address }}">
            <span style="color: red">{{ userinfoform.address.errors }}</span>
        </div>
        <div class="form-group">
            <div class="row">
                <div class="col-md-3">
                    <label>头像</label>
                    <img src="/static/{{ userinfo.picture }}" width="100px">
                    <input class="form-control" type="file" name="picture">
                </div>
            </div>
        </div>
        <div class="form-group">
            <input type="submit" class="btn btn-primary btn-user btn-block" value="提交">
        </div>
    </form>
{% endblock %}